/*
 * @Author: liyongxuan
 * @Date: 2018-1-10 10:37:42
 * @Last Modified by: liyongxuan
 * @Last Modified time: 2018-1-10 10:37:42
 * @description项目管理-拟投资
 */
<!--项目管理-拟投资 -->
<template>
    <div>
        <div class="right__detail">
            <!-- 拟投资头部组件 -->
            <csHeader :itemId="itemID" @projectMan="projectMan"></csHeader>
            <!-- 项目节点 -->
            <csNode v-model="node" :dataType="1"></csNode>
            <el-tabs type="border-card" v-model="tabIndex" class="ca-tabs ca-m-t-15" @tab-click="handleClick">
                <el-tab-pane :label="tabArr[0]" :disabled="!isNoAuth('拟投资项目-项目详情-查看')">
                    <!-- 项目详情 -->
                    <csRedDot slot="label" :label="tabArr[0]" :showDot="dotStateList[0]"></csRedDot>
                    <csProDetail v-if="tabIndex==0" :itemId="itemID"></csProDetail>
                </el-tab-pane>
                <el-tab-pane :label="tabArr[1]" :disabled="!isNoAuth('拟投资项目-立项-查看')">
                    <!-- 立项 -->
                    <csRedDot slot="label" :label="tabArr[1]" :showDot="dotStateList[1]"></csRedDot>                    
                    <csNewProject v-if="tabIndex==1" :itemId="itemID" :proMan="proMan"></csNewProject>
                </el-tab-pane>
                <el-tab-pane :label="tabArr[2]" :disabled="!isNoAuth('拟投资项目-尽调-查看')">
                    <!-- 尽调 -->
                    <csRedDot slot="label" :label="tabArr[2]" :showDot="dotStateList[2]"></csRedDot>                    
                    <csFileList v-if="tabIndex==2" class="ca-m-t-15" :businessId="itemID" title="尽调报告" :fileType="'10014'" :isShowSearch="false" :isShowFileChildType="false" @addDot="save" :addAuth="'拟投资项目-尽调-编辑'"></csFileList>
                </el-tab-pane>
                <el-tab-pane :label="tabArr[3]" :disabled="!isNoAuth('拟投资项目-风控会-查看')">
                    <!-- 风控会 -->
                    <csRedDot slot="label" :label="tabArr[3]" :showDot="dotStateList[3]"></csRedDot>                    
                    <csRiskControl v-if="tabIndex==3" :itemId="itemID" :proMan="proMan"></csRiskControl>
                </el-tab-pane>
                <el-tab-pane :label="tabArr[4]" :disabled="!isNoAuth('拟投资项目-投决会-查看')">
                    <!-- 投决会 -->
                    <csRedDot slot="label" :label="tabArr[4]" :showDot="dotStateList[4]"></csRedDot>                    
                    <csVoteDecision v-if="tabIndex==4" :itemId="itemID" :proMan="proMan"></csVoteDecision>
                </el-tab-pane>
                <el-tab-pane :label="tabArr[5]" :disabled="!isNoAuth('拟投资项目-协议签署-查看')">
                    <!-- 协议签署 -->
                    <csRedDot slot="label" :label="tabArr[5]" :showDot="dotStateList[5]"></csRedDot>                    
                    <csAgreementSign v-if="tabIndex==5" :itemId="itemID" :proMan="proMan"></csAgreementSign>
                </el-tab-pane>
                <el-tab-pane :label="tabArr[6]" :disabled="!isNoAuth('拟投资项目-打款-查看')">
                    <!-- 打款 -->
                    <csRedDot slot="label" :label="tabArr[6]" :showDot="dotStateList[6]"></csRedDot>                    
                    <csPlayMoney v-if="tabIndex==6" :itemId="itemID"></csPlayMoney>
                </el-tab-pane>
            </el-tabs>
        </div>
    </div>
</template>

<script type='text/ecmascript-6'>
    import { getDetailRemind,read,addRemind,isNoAuth } from '__service/utils';
    export default {
        data() {
            return {
                proMan: null,
                tabArr: ['项目详情', '立项', '尽调', '风控会', '投决会', '协议签署', '打款'],//tab名称
                node: this.$store.state.user.dictionaryMap.quasiNode,
                itemID: this.$route.params.itemId,
                tabIndex: this.$route.params.tabIndex + '' || '0',//页面索引
                dotStateList: [false, false, false, false, false, false, false], // 小红点状态
            }
        },
        beforeRouteEnter(to, from, next) {
            next( vm => {
                // 遍历所有tab 权限
                if (!isNoAuth('拟投资项目-' + vm.tabArr[vm.tabIndex] + '-查看')) {
                  let flag = false;
                  for (let i = vm.tabIndex; i < vm.tabArr.length; i++) {
                      if (isNoAuth('拟投资项目-' + vm.tabArr[i] + '-查看')) {
                          vm.tabIndex = i.toString();
                          flag = true;
                          break;
                      }
                  }
                  if (!flag) {
                    for (let i = 0; i < vm.tabIndex; i++) {
                        if (isNoAuth('拟投资项目-' + vm.tabArr[i] + '-查看')) {
                            vm.tabIndex = i.toString();
                            flag = true;
                            break;
                        }
                    }
                  }
                  if (!flag) {
                      vm.$message({
                          message: '没有此页面的操作权限',
                          type: 'error',
                          center: true
                      });
                      vm.$router.replace({name: 'personal-center', params: {tabIndex: '0', openWindow: false}})
                  }
                }
            })
        },
        watch: {
        },
        props: {},
        computed: {
        },
        created() {
        },
        mounted() {
            isNoAuth('')
            this.getDotList()
            // 为子组件创建的第三方组件方法
            this.$root.Dot.$on('getDotList', () => {
                this.getDotList();
            })
        },
        methods: {
            projectMan(val) {
                this.proMan = val
            },
            // 尽调添加红点
            async save() {
                // 添加小红点
                await addRemind({
                    dataId: this.$route.params.itemId, // 业务id
                    dataTab: 2, // tab页顺序 head 也为0
                    dataType: 1, // 1拟投资项目,2已投资项目,3母基金,4拟设立基金,5已设立基金,6客户,7潜在项目
                });
                // 根据第三方组件来调用 父组件中定义的方法 重新获取小红点
                this.$root.Dot.$emit('getDotList');
            },
            // 设置小红点状态
            async getDotList() {
                const dotList = await getDetailRemind({ dataId: this.$route.params.itemId, dataType: 1 });
                dotList.map(x => {
                    this.dotStateList[x.dataTab] = true;
                });
                this.dotStateList = this.dotStateList.concat([]);
            },
            // 切换tab
            handleClick(val) {
                //去除小红点
                read({ dataId: this.$route.params.itemId, dataTab: val.index, dataType: 1 });
                this.dotStateList[val.index] = false;
                this.dotStateList = this.dotStateList.concat([]);
                // 设置小红点状态 end
            },
        },
        beforeDestroy() {
            // 销毁小红点第三方vue
            this.$root.Dot.$off('getDotList');
        },
        components: {
            csHeader: require('./header/index'),//拟投资项目详情头部
            csNode: require('__components/project-node/index'),//项目节点
            csProDetail: require('./tab/proDetail/index'),//项目详情
            csNewProject: require('./tab/newProject/index'),//立项
            csRiskControl: require('./tab/riskControl/index'),//风控会
            csVoteDecision: require('./tab/voteDecision/index'),//投决会
            csAgreementSign: require('./tab/agreementSign/index'),//协议签署
            csPlayMoney: require('./tab/playMoney/index'),//打款
            csFileList: require('__components/file-list/index'),//文件列表
            csRedDot: require('__components/red-dot'), // 小红点
        },
    }
</script>
<style rel='stylesheet/scss' lang='scss' scoped>

</style>
